<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>兴趣测评</title>
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/bootstrap/css/bootstrap-submenu.css">

<!--<script src="js/jquery-3.3.0.js" type="text/javascript"></script>-->
<!--<script src="js/bootstrap.min.js" type="text/javascript"></script>-->
<!--&lt;!&ndash;验证码引用  &ndash;&gt;-->
<!--<script src="js/verificationCode.js" type="text/javascript"></script>-->
<!--<script src="js/jquery-3.3.0.js"></script>-->
<!--<script src="js/bootstrap.min.js"></script>-->
<!--<script type="text/javascript" src="js/sweetalert.min.js"></script>-->
<!--<script type="text/javascript" src="js/publicSection.js"></script>-->
</head>
<body id="changed1">
<!--头部引用  -->
<div class="container" id="frontTop">
	</div>

<div class="container"  style="margin-top: 50px" >
<div class="row">
    <div class="progress  col-md-9  " style="height:20px;">
        <div class="progress-bar progress1"  id="progress2" style="width:1%;"></div>
    </div>
    <div class="col-md-2  offset-1 progress1" id="progress3"  style="border: solid 1px black" >0/90</div>
</div>
</div>

<div class="container " style="margin-top: 20px" >
    <div class="timer rounded-circle text-xl-center  offset-10" style="border: solid 1px black;width: 200px;height: 50px">
        <strong id="hour">00时</strong>
        <strong id="minute">00分</strong>
        <strong id="second">00秒</strong>
    </div>
</div>
<div class="container  text-xl-center" style="font-size: 20px;margin-top: 30px;height:200px; border:solid 2px  black">
     <div class="row">
		 <div class="col-md-2 ">
       			 <input  class="btn btn-primary" id="shangyiti"   style="margin-top: 75px; " type="button"  value="上一题">
    		</div>
   <div class="col-md-8"   id="itemBank" >   
    <div class="tab-pane active  container"  style="margin-top: 50px" id="question1"  >
        <h3>别人评价我做事有条理</h3>
        <div class="custom-radio">
            <label><input type="radio"  name="question1" value="1"/>是</label>
        </div>
        <div class="custom-radio">
            <label><input type="radio" name="question1"  value="2"/>否</label>
        </div>
    </div>
    </div>
     	 <div class="col-md-2">
      		  <input  class="btn btn-primary"  id="xiayiti" style="margin-top: 75px;" type="button"value="下一题">
   	 	</div>
    </div>
</div>


   

<div class="container text-xl-center"  style="margin-top: 50px">
 <button type="button" class="btn btn-primary submit1" data-toggle="modal" data-target="#myModal">
   提交试卷
  </button>
   
  <!-- 模态框 -->
  <div class="modal fade" id="myModal">
    <div class="modal-dialog">
      <div class="modal-content">
   
         <div class="modal-header">
        
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <!-- 模态框主体 -->
        <div class="modal-body" style="color:#EE4000">
			      <h4>你还有题未做完是否确认提交,</h4>
       				<h4>若点击确认则返回主页面，</h4>
       				<h4>点击取消或其他则继续做题</h4>
      </div>
   
        <!-- 模态框底部 -->
        <div class="modal-footer">
        <button	type="button" class="btn btn-danger submit2" style="margin-right: 100px">确认</button>
          <button type="button" class="btn btn-secondary" style="margin-right: 100px" data-dismiss="modal">取消</button>
        </div>
   
      </div>
    </div>
  </div>
  




</div>

    <!--底部信息  -->

	<div class="container" id="frontBottom">
	</div>
</body>
<script src="/js/jquery-3.3.0.js"></script>
<script src="/layui/layui.js"></script>
<script src="/js/core.util.js"></script>
<script src="/bootstrap/bootstrap.min.js"></script>
<script>
    $("#frontTop").load("/index/frontTop");
    $("#frontBottom").load("/index/frontBottom");

$(document).ready(function () {


        for (var i=2;i<=90;i++) {
            $("#itemBank").append("<div class='tab-pane container d-none ' style='margin-top: 50px'  id='question"+i+"'>" +
                "<h3 class='squestion"+i+"'>hello</h3>" +
                "<div class='custom-radio '  >" +
                "<label class='question"+i+"'><input type='radio'  name='question"+i+"' value='1' />是</label></div>" +
                "<div class='custom-radio'>" +
                "<label class='question"+i+"' ><input type='radio'     name='question"+i+"' value='2'/>否</label>" +
                "</div></div>");
              
        }
var strings = new Array();
var string = "我喜欢独自策划活动，经常希望免于干预.在集体讨论中，如果没有深入研究，我总是保持沉默.我被认为能歌善舞.每次写作文我都一挥而就.如果遇到难题，我会不停思考，甚至彻夜无眠.我喜欢理财.我喜欢抽象思维的工作，不喜欢动手的工作.我经常成为班级的风云人物.我经常沾沾自喜.我喜欢参加户外拓展活动.夜深人静时，我的学习效率更好.我喜欢做计划.我喜欢修理电视，自行车一类的工作.我喜欢参加各种类型Party.未来我喜欢找到一份稳定的职业，工资少也无所谓.我经常沉醉于美好的音乐之中.别人说我办事冲动.我是一个遵守纪律的学生.我更喜欢智力类游戏.我很难集中精力两小时以上.我乐于动手制作一些小玩意.我不喜欢动手操作，动手能力很差.我喜欢与人沟通，即使陌生人也无所谓.和别人讨论时我经常放弃自己的观点.我有很多朋友.我做事不偏不倚，温和有度.当我认真做一件事，即使碰到在困难，我也会不达目的，誓不罢休.别人说我从不喜形于色，情绪稳定.我喜欢按部就班的做事，不喜欢被打扰.我的理想是当一名科学家.与言情电影相比，我更喜欢推理电影.我从不服气霸道的人，即使他是正确的.我的思想总是天马行空.我总是喜欢提建议和意见.我喜欢使用螺丝刀等工具.帮助别人我感到快乐.我喜欢和人打赌.从小父母就夸我是一名听话的孩子.未来工作我希望尝试不同的行业或岗位.我的时间观念很强，讨厌别人迟到.我喜欢阅读自然科学方面书籍和杂志.如果我能够掌握一门手艺，并赚很多钱，我会很满足.我对家电修理比较感兴趣.别人的不幸，很难引起我的同情.我宁愿做图书销售，也不愿意做图书管理员.我不喜欢与各类机械设备打交道.小时候，我是个“破坏家”，经常拆开玩具看个究竟.我经常以一种独创方法完成任务.我有书画方面的天赋.我的书桌总是整整齐齐，井然有序.我的理想职业是教师.和别人在一起时，我总想不出恰当的话题沟通.我喜欢看情感剧，时常被剧情感动.我讨厌学物理.当我独自做实验时，我会非常无聊.我经常包容急躁，易怒的同学，并以礼相待.遇到难题，我总是喜欢放弃.大家公认我是一名勤劳踏实、愿为大家服务的人.我喜欢做老师的秘书，协助老师管理班级.在工厂实习中，我更喜欢监视流水线上的机器.我喜欢研究太空旅行.我喜欢为杂志撰写故事或文章.我希望未来能够从事护理工作.未来我要创办自己的公司.我喜欢校对和制作表格.我渴望在蔚蓝的大海上工作.我对基因十分感兴趣.我擅长主持一场广播节目.我喜欢教儿童识字.我要做一名公正的法官.我能够组织和安排办公室会议.我经常自己写诗歌.我觉得帮助老人做日常活动有意义.在百货公司销售产品更有趣.如果森林着火，我会参加灭火活动.我喜欢做生物和化学实验.我的电脑文件管理得规范系统.我能写一首歌.我喜欢买卖股票和债券.我希望从事职业发展指导类工作.我渴望有自己的池塘养鱼.我喜欢研究人体结构.我的职业理想是专业IT人员.我喜欢学习机械技术课程.我经常研究文明史.我渴望在做一名电影导演。.我觉得帮助残疾人很快乐.我喜欢做企业管理工作.我希望自己成为一名会计师.."
  strings = string.split(".");

    for (var i=2;i<=90;i++){
        console.log(strings[i-2])
        $(".squestion"+i+"").html(strings[i-2]);
    }




    //计时器
    var intDiff = parseInt(0);//倒计时总秒数量
    function timer(intDiff) {
        window.setInterval(function () {
            var  hour=0,
                minute = 0,
                second = 0;//时间默认值

            if (intDiff > 0) {
                hour = Math.floor(intDiff/3600);
                minute = Math.floor((intDiff -hour*3600 )/ 60);
                second = Math.floor(intDiff) - (minute * 60);
            }
            if(hour<=9) hour = '0'+hour;
            if (minute <= 9) minute = '0' + minute;
            if (second <= 9) second = '0' + second;
            $('#hour').html('<s></s>' + hour + '时');
            $('#minute').html('<s></s>' + minute + '分');
            $('#second').html('<s></s>' + second + '秒');
            intDiff++;
        }, 1000);

    }
    $(function () {
        timer(intDiff);
    });

    //实现三点同步
 var count=0,j =1,m=1;
 var arr = new Array([91]);
    for (var i=1;i<91;i++)
    {
        arr[i]=0;
    }

    $("#changed1").change(function () {
     count=0;
        for(var i=1;i<91;i++)
        {
            var a = $("input[name='question"+i+"']:checked").val();
            if(a!=null)
            {
                if(a==1)
                {
                    arr[i] =1;
                }
               else
                {
                    arr[i] = 2;
                }
            }
        }
        for (var i=1;i<91;i++)
        {
            if(arr[i] ==1|| arr[i]==2)
            {
                $("#aquestion" + i + "").css({"background-color": "green"});
            }
            if(arr[i]==2)
            {
                count=count+arr[i]-1;
            }
            else {
                count=count+arr[i];
            }


        //console.log(count);
        }
       var s = parseInt(count/90 *100)+"%";
        $("#progress2").css("width",s);
        $("#progress3").html(count+"/90");
        if(count==90)
        {
            $("#progress2").css("width","100%");
            $("#progress3").html("90/90");
        }
    })

    
        $("#shangyiti").click(function () {
			for(var i=1;i<=90;i++)
			{var s = i-1;
			//console.log("#question"+i+"");
			if(!$("#question"+i+"").is(".d-none"))
				{
				if(i!=1)
					{
					$("#question"+i+"").addClass("d-none");
					$("#question"+s+"").removeClass("d-none");
					break;
					}
			
				console.log("#question"+i+"");
				
				}
			}
        	
    });
        $("#xiayiti").click(function () {
        	for(var i=1;i<=90;i++)
        	{	var s = i+1;
      			if(!$("#question"+i+"").is(".d-none"))
        				{
        				console.log("#question"+i+"");
        				if(i!=90)
        					{
        					$("#question"+i+"").addClass("d-none");
            				$("#question"+s+"").removeClass("d-none");   
            				break;
        					}
        			
        				}
        	}
        });
 	    
    

    
    $(".submit1").click(function(){
    	
    	console.log("1");
    	if(count==90){
   		 window.location.href = "interestTestResults"	 
   	}	
    });
	//未做完题
 
    $(".submit2").click(function(){
    	
    	
    
   		 window.location.href = "/index/home"
   
    });
 




})




</script>
</html>